/*
 * @Description: 首页、我的预约列表页
 * @Author: ziwei.ma
 * @Date: 2019-08-07 14:02:15
 * @Last Modified by: ziwei.ma
 * @Last Modified time: 2019-08-20 17:37:01
 */

<template>
  <div id="App">
    <title-bar
      :titleText="pageName"
      :rightBtn="isShowService"
    ></title-bar>
    <div class="page">
      <!-- <router-view></router-view> -->
      <home-page v-if="showPage==='homepage'"></home-page>
      <my-reservation v-else-if="showPage==='myreservation'"></my-reservation>
    </div>
    <bottom-bar @pageType="pageType"></bottom-bar>
  </div>
</template>

<script>
import TitleBarVue from './components/TitleBar'
import BottomBarVue from './components/BottomBar.vue'
import { getGlobals } from './api/api'
import HomePageVue from './page/HomePage.vue'
import MyReservation from './page/MyReservation.vue'

export default {
  components: {
    'title-bar': TitleBarVue,
    'bottom-bar': BottomBarVue,
    'home-page': HomePageVue,
    'my-reservation': MyReservation
  },
  data() {
    return {
      pageName: '包车',
      isShowService: true,
      optimizeBusList: [],
      showPage: 'homepage'
    }
  },
  mounted() {
    getGlobals().then(res => {
      let BCglobals = res
      localStorage.setItem('BCglobals', JSON.stringify(BCglobals))
    })
  },
  methods: {
    pageType(pageName, isShowService, showPage) {
      this.pageName = pageName
      this.isShowService = isShowService
      this.showPage = showPage
    }
  }
}
</script>

<style>
html,
body,
#App {
  height: 100%;
  background-color: #f2f5f6;
  overflow: hidden;
}
.page {
  height: 100%;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
</style>
